$spacer: 10px !default;
$spacers: () !default;
//map添加数据map-merge($map1:value1,$map2:value2)，$map2为继承数据
$spacers: map-merge(
  (
    0: 0,
    1: $spacer,
    2: $spacer * 2,
    3: $spacer * 3,
    4: $spacer * 4,
    5: $spacer * 5
  ),
  $spacers
);

$item: () !default;
//key值为padding等，整体结构类似对象。
//class是生成的class名前缀,property是生成的$spacerscss属性，value是上面的$spacers
$utilities: map-merge(
  (
    "padding": (
      property: padding,
      class: p,
      values: $spacers
    ),
    "padding-bottom": (
      property: padding-bottom,
      class: pb,
      values: $spacers
    ),
    "padding-top": (
      property: padding-top,
      class: pt,
      values: $spacers
    ),
    "padding-left": (
      property: padding-left,
      class: pl,
      values: $spacers
    ),
    "padding-right": (
      property: padding-right,
      class: pr,
      values: $spacers
    ),
    "margin": (
      property: margin,
      class: m,
      values: $spacers
    ),
    "margin-left": (
      property: margin-left,
      class: ml,
      values: $spacers
    ),
    "margin-right": (
      property: margin-right,
      class: mr,
      values: $spacers
    ),
    "margin-top": (
      property: margin-top,
      class: mt,
      values: $spacers
    ),
    "margin-bottom": (
      property: margin-bottom,
      class: mb,
      values: $spacers
    ),
    "padding-x": (
      property: padding-right padding-left,
      class: px,
      values: $spacers
    ),
    "padding-y": (
      property: padding-top padding-bottom,
      class: py,
      values: $spacers
    ),
  ),
  $item
);

//key是utilities 里面的key。
@each $key, $utility in $utilities {
  //map-get取map的数值，map-get($map:$value,$key:values)，结果为：（0:0,1:10px...）
  $values: map-get($utility, values);
  //对上例values做循环
  @each $key, $value in $values {
    //取得$utilities的property数据
    $properties: map-get($utility, property);
    //取得$utilities的class数据  例如p，px，py
    $property-class: map-get($utility, class);
    //取得$utilities的class后缀  例如-10，-20，-30
    $property-class-modifier: if($key, "-" + $key, "");
    // @each $property in $properties {
      //@debug $properties;
      .#{$property-class + $property-class-modifier} {
        @each $property in $properties {
            #{$property}: $value !important;
          }
        }
    // }
  }

}